<template>
  <div>
    <tab-bar>
      <tab-bar-item link="/home" activeColor="#409EFF">
        <template #item-img><van-icon name="home-o" size="24" /></template>
        <template #item-text>首页</template>
      </tab-bar-item>
      <tab-bar-item link="/exclusive" activeColor="#409EFF" v-if="this.$store.state.token == 'admin'">
        <template #item-img><van-icon name="vip-card-o" size="24" /></template>
        <template #item-text>管理</template>
      </tab-bar-item>
      <tab-bar-item link="/browse" activeColor="#409EFF" v-else>
        <template #item-img><van-icon name="label-o" size="24" /></template>
        <template #item-text>浏览</template>
      </tab-bar-item>
      <tab-bar-item link="/shopcart" activeColor="#409EFF">
        <template #item-img><van-icon name="shopping-cart-o" size="24" /></template>
        <template #item-text>购物车</template>
      </tab-bar-item>
      <tab-bar-item link="/personal" activeColor="#409EFF">
        <template #item-img><van-icon name="contact" size="24" /></template>
        <template #item-text>个人</template>
      </tab-bar-item>
    </tab-bar>
  </div>
</template>

<script>
import TabBar from 'components/common/tabbar/TabBar'
import TabBarItem from 'components/common/tabbar/TabBarItem'

export default {
  name: 'MainTabBar',
  components: {
    TabBar,
    TabBarItem
  }
}
</script>

<style scoped>
/* @import url(); 引入css类 */
</style>
